<template>
  <el-cascader v-model="valueId" :placeholder="placeholder" clearable :props="cascaderProps"></el-cascader>
</template>
<script setup lang="ts">
import type { CascaderProps } from 'element-plus'
import { getRegion } from '@/api/system/region/index'
const props = defineProps({
  /**当前双向数据绑定的值 */
  modelValue: {
    type: [String, Number],
    default: ''
  },
  /**输入框内部的文字 */
  placeholder: {
    type: String,
    default: '请选择'
  }
})

const emit = defineEmits(['update:model-value']);

const { proxy } = getCurrentInstance() as ComponentInternalInstance;

const valueId = computed({
  get: () => {
    let val = props.modelValue ? [(props.modelValue as string).substring(0, 2), (props.modelValue as string).substring(0, 4), props.modelValue] : []
    console.log(12313, val)
    return val
  },
  set: (val) => {
    emit('update:model-value', val && val.length ? val[2] : '');
  }
});

const cascaderProps: CascaderProps = {
  lazy: true,
  lazyLoad(node, resolve) {
    const { level } = node
    getRegion(node.value).then(res => {
      let nodes = res.data.map(it => ({
        value: it.code,
        label: it.name,
        leaf: level >= 2,
      }))
      resolve(nodes)
    })
  },
}
</script>